<template>
  <div class="dynamicCharts">
    ??
    <VeLine :data="chartData" width="800px" height="400px"></VeLine>
    <components></components>
  </div>
</template>
<script>
import { getChartData } from '@/api/table'

import VeLine from 'v-charts/lib/line'
export default {
  components: { VeLine },
  data() {
    return {
      componentId: 'VeLine',
      chartData: {
        columns: ['日期', '销售量'],
        rows: [
          { 日期: '1月1日', 销售量: 123 },
          { 日期: '1月2日', 销售量: 1223 },
          { 日期: '1月3日', 销售量: 2123 },
          { 日期: '1月4日', 销售量: 4123 },
          { 日期: '1月5日', 销售量: 3123 },
          { 日期: '1月6日', 销售量: 7123 }
        ]
      }
    }
  },
  created() {
    // this.getList()
  },
  methods: {
    getList() {
      getChartData().then(res => {
        this.chartData = res.data
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.dynamicCharts {
  width: 100%;
  height: 100%;
}
</style>